<!-- MBC Jonathan hide many complex settings, we can do these later -->
<ion-view id="tab-settings" class="settings" show-tabs>
  <ion-nav-bar class="bar-royal">
    <ion-nav-title>{{'Settings' | translate}}</ion-nav-title>
  </ion-nav-bar>

  <ion-content>
    <div class="settings-list list">
      <!--<div class="item item-divider"></div>-->
      <!-- <a class="item item-icon-left item-icon-right" ui-sref="tabs.addressbook">
        <i class="icon big-icon-svg">
          <img src="img/icon-address-book.svg" class="bg"/>
        </i>
        <span>{{'Address Book' | translate}}</span>
        <i class="icon bp-arrow-right"></i>
      </a> -->
      <!-- <a class="item item-icon-left item-icon-right" ng-click="openExternalLink()">
        <i class="icon big-icon-svg">
          <img src="img/icon-help-support.svg" class="bg"/>
        </i>
        <span>{{'Help & Support' | translate }}</span>
        <i class="icon big-icon-svg">
          <img src="img/icon-link.svg" class="bg just-a-hint"/>
        </i>
      </a> -->
      <!-- <a class="item item-icon-left item-icon-right" ui-sref="tabs.feedback">
        <i class="icon big-icon-svg">
          <img src="img/icon-send-feedback.svg" class="bg"/>
        </i>
        <span>{{'Send Feedback' | translate}}</span>
        <i class="icon bp-arrow-right"></i>
      </a> -->
      <!--<a ng-if="isCordova && !isWindowsPhoneApp" class="item item-icon-left item-icon-right" ui-sref="tabs.shareApp({score: 4, skipped: true, fromSettings: true})">-->
        <!--<i class="icon big-icon-svg">-->
          <!--<img src="img/icon-heart.svg" class="bg"/>-->
        <!--</i>-->
        <!--<span translate>Share {{appName}}</span>-->
        <!--<i class="icon bp-arrow-right"></i>-->
      <!--</a>-->

      <div class="item item-divider">{{'Preferences' | translate}}</div>

       <!--<a class="item item-icon-left item-icon-right" ui-sref="tabs.notifications">-->
        <!--<i class="icon big-icon-svg">-->
          <!--<img src="img/icon-notifications.svg" class="bg"/>-->
        <!--</i>-->
        <!--<span>{{'Notifications' | translate}}</span>-->
        <!--<i class="icon bp-arrow-right"></i>-->
      <!--</a>-->

      <a class="item has-setting-value item-icon-left item-icon-right" ui-sref="tabs.language">
       <i class="icon big-icon-svg">
         <img src="img/icon-language.svg" class="bg"/>
       </i>
       <span class="setting-title">{{'Language' | translate}}</span>
       <span class="setting-value">
         {{currentLanguageName|translate}}
       </span>
       <i class="icon bp-arrow-right"></i>
     </a>
      <a class="item has-setting-value item-icon-left item-icon-right" ui-sref="tabs.unit">
        <i class="icon big-icon-svg">
          <img src="img/icon-unit.svg" class="bg"/>
        </i>
        <span class="setting-title">{{'Mobicoin Unit' | translate}}</span>
        <span class="setting-value">
          {{unitName}}
        </span>
        <i class="icon bp-arrow-right"></i>
      </a>

     <!--  <a class="item has-setting-value item-icon-left item-icon-right" ui-sref="tabs.altCurrency">
        <i class="icon big-icon-svg">
          <img src="img/icon-alternative-currency.svg" class="bg"/>
        </i>
        <span class="setting-title">{{'Alternative Currency' | translate}}</span>
        <span class="setting-value">
          {{selectedAlternative.name}}
        </span>
        <i class="icon bp-arrow-right"></i>
      </a> -->

      <a class="item has-setting-value item-icon-left item-icon-right" ui-sref="tabs.fee">
        <i class="icon big-icon-svg">
          <img src="img/icon-network.svg" class="bg"/>
        </i>
        <span class="setting-title">{{'Mobicoin Network Fee Policy' | translate}}</span>
        <span class="setting-value">
          {{feeOpts[currentFeeLevel]|translate}}
        </span>
        <i class="icon bp-arrow-right"></i>
      </a>

      <!-- <a class="item has-setting-value item-icon-left item-icon-right" ui-sref="tabs.lockSetup" ng-if="(isCordova || isDevel) && !isWindowsPhoneApp">
        <i class="icon ion-ios-locked-outline" ng-if="locked"></i>
        <i class="icon ion-ios-unlocked-outline" ng-if="!locked"></i>
        <span class="setting-title">{{'Lock App' | translate}}</span>
        <span class="setting-value">
          {{method}}
        </span>
        <i class="icon bp-arrow-right"></i>
      </a> -->

      <div class="item item-divider" ng-show="wallets[0]">{{'Wallets & Integrations' | translate}}</div>

      <a class="item item-icon-left item-icon-right" href
           ui-sref="tabs.preferences({'walletId': item.id})"
           ng-repeat="item in wallets track by $index">
         <i class="icon big-icon-svg circle">
           <img src="img/icon-wallet.svg" ng-class="{'wallet-background-color-default': !item.color}" ng-style="{'background-color': item.color}" class="bg"/>
        </i>
        <span>
          {{item.name || item.id}}
          <span class="size-12 text-light" ng-show="item.n > 1">
            {{item.m}}-of-{{item.n}}
          </span>
        </span>
        <span class="right text-light assertive" ng-show="!item.isComplete()">
          {{'Incomplete' | translate}}
        </span>
        <span class="right text-light assertive" ng-show="item.isComplete() && item.needsBackup">
          {{'Backup needed' | translate}}
        </span>
        <i class="icon bp-arrow-right"></i>
      </a>

      <a class=" item item-icon-left item-icon-right"
         ng-if="bitpayAccounts || bitpayCards"
         ui-sref="tabs.preferences.bitpayServices">
        <i class="icon big-icon-svg circle">
          <div class="bg icon-bitpay"></div>
        </i>
        <span>BitPay</span>
        <i class="icon bp-arrow-right"></i>
      </a>

      <div ng-repeat="service in buyAndSellServices">
        <a class="item item-icon-right"
          ui-sref="{{service.configSref}}">
          <img ng-src="{{service.logo}}" width="90">
          <i class="icon bp-arrow-right"></i>
        </a>
      </div>

      <div class="item item-divider"></div>

      <!-- <a class="item item-icon-right item-icon-left" href ui-sref="tabs.advanced">
        <i class="icon big-icon-svg">
          <img src="img/icon-advanced.svg" class="bg"/>
        </i>
        <span>{{'Advanced' | translate}}</span>
        <i class="icon bp-arrow-right"></i>
      </a> -->

      <a class="item item-icon-left item-icon-right" href ui-sref="tabs.about">
        <i class="icon big-icon-svg">
          <img src="img/icon-about.svg" class="bg"/>
        </i>
        <span>{{'About' | translate}}</span> {{appName}}
        <i class="icon bp-arrow-right"></i>
      </a>
      <!--<div class="item item-divider"></div>-->
    </div>
  </ion-content>
</ion-view>
